<template>
  <div class="hello">
    <ul>
      <li v-for="item in fatherlist" :key="item.id">
        <span>{{ item.name }}</span>
        <span>{{ item.age }}</span>
      </li>
    </ul>
    <input type="text" v-model="name" />
    <button @click="add">添加到父组件里面</button>
  </div>
</template>
  <script>
export default {
  data() {
    return {
      name: "",
    };
  },
  //接收子组件
  props: {
    fatherlist: {
      type: Array, //接收过来的数据给他一个类型
    },
  },
  //子传父方法
  methods: {
    // 一个add的方法
    add() {
      //子传父通过$emit  toAdd是传给子组件的方法，this.name是传给父组件的数据
      this.$emit("toAdd", this.name);
    },
  },
};
</script>